<template>
  <b-row v-if="data!=null" @click="toDetail">
    <!-- 封面图 -->
    <b-col v-if="fanju != null" class="col-auto onHover">
      <b-img-lazy class="rounded-lg border shadow-sm" height="150px" width="100px"
        blank-src="https://s1.imagehub.cc/images/2023/03/27/c6c15085392b10160e0141e725c0ce91.webp" :src="'https://images.weserv.nl/?url='+fanju.cover" />
    </b-col>
    <!-- 标题和内容 -->
    <b-col v-if="fanju != null" style="font-family:HYZhengYuan-55S">
      <b-row>
        <b-col class="pl-1 pr-2">
          <h5 class="onHover">
            {{fanju.title}}
          </h5>
        </b-col>
      </b-row>
      <b-row>
        <b-col class="pl-1 pr-2">
          <span class="text-muted">
            {{fanju.new_ep.index_show}}
          </span>
        </b-col>
      </b-row>
      <b-row class="mt-2">
        <b-col class="pl-1 pr-2">
          <span class="text-dark">{{data.time}} 追番</span>
        </b-col>
      </b-row>
    </b-col>
  </b-row>
  <b-row v-else-if="data.total == 0">
    <b-col class="text-center" style="font-family:HYZhengYuan-55S">
      <h5>暂无内容</h5>
    </b-col>
  </b-row>
</template>
<script>
export default {
  props: {
    data: Object
  },
  data() {
    return {
      fanju: null
    }
  },
  created() {
    this.$httpBangumi.bangumiSimple(this.data.followId).then((res) => {
      this.fanju = res
      // console.log(res);
    }).catch((err) => {
      console.log(err);
    });
  },
  methods: {
    //进入详情
    toDetail() {
      this.$pageRedirect.toAnimationDetails(this.data.followId, "media_id");
    }
  },
}
</script>
<style scoped>
onHover:hover {
  cursor: pointer;
}
</style>
